<template>
  <div>
    <input type="file" @change="selectFiles" multiple>
    <button @click="uploadFiles">多文件上传</button>
  </div>
<!--  <div>-->
<!--    <input type="file" @change="onFileChange">-->
<!--    <button @click="uploadFile">单文件上传</button>-->
<!--  </div>-->
</template>

<script>
/* eslint-disable */
import axios from 'axios'
export default {
  name: 'simpleFileUpload',
  data() {
    return {
      selectedFile: null,
      selectedFiles: []
    };
  },
  methods: {
    onFileChange(e) {
      this.selectedFile = e.target.files[0];
    },
    uploadFile() {
      const formData = new FormData();
      formData.append('file', this.selectedFile)
      formData.append('uploadType', 'product')

      axios.post('http://localhost:9999/app/thirdPart/server/upload', formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      })
        .then(response => {
          console.log(response.data);
        })
        .catch(error => {
          console.error(error);
        });
    },
    // 多个文件
    selectFiles(event) {
      this.selectedFiles = event.target.files;
    },
    uploadFiles() {
      const formData = new FormData();
      for (let file of this.selectedFiles) {
        formData.append('files', file);
      }
      formData.append('uploadType', 'product')

      axios.post('http://localhost:9999/app/thirdPart/simple/uploadFiles', formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      })
        .then(response => {
          console.log(response.data);
        })
        .catch(error => {
          console.error(error);
        });
    }
  }
};
</script>
